feat(web): add extensible command palette by binbandit · Pull Request #1103 · pingdotgg/t3code

binbandit · 2026-03-15T04:13:30Z

Summary

add a layout-scoped command palette using the existing coss command primitives
wire commandPalette.toggle through contracts, server defaults, the sidebar trigger, and keybinding docs
share thread-creation logic between shortcuts and palette actions, and avoid command-palette subscriptions/work while the palette is closed

Validation

bun fmt
bun lint
bun typecheck
bun run test -- src/keybindings.test.ts in packages/contracts
bun run test -- src/keybindings.test.ts in apps/server
bun run test -- src/keybindings.test.ts in apps/web
bun run test:browser -- src/components/ChatView.browser.tsx -t "opens the command palette from the configurable shortcut and runs a command" in apps/web

Visual

Note

Add extensible command palette with mod+k shortcut to the sidebar and global shortcuts

Adds a command palette (mod+k) accessible via a new Search button in the sidebar and a global keyboard shortcut, backed by a Zustand store (commandPaletteStore.ts).
The palette supports searching across actions, projects, and threads, with submenus, keyboard navigation, and ranked filtering via helpers in CommandPalette.logic.ts.
Thread sorting logic is extracted from Sidebar.logic.ts into a shared threadSort.ts module used by both the sidebar and the palette.
ChatView and global shortcut handling in _chat.tsx now short-circuit when the palette is open to prevent shortcut conflicts.
Behavioral Change: commandPalette.toggle is registered as a valid keybinding command; anchored toasts now render at z-100 to appear above the palette backdrop.

^{Macroscope summarized 0fffcb9.}

Note

Medium Risk
Moderate risk due to new global UI overlay and changes to shortcut handling/thread creation paths, which could introduce navigation or keybinding regressions. No auth/payment or sensitive data logic is touched.

Overview
Adds an extensible command palette UI, surfaced via a new sidebar “Search” trigger and a new commandPalette.toggle keybinding (default mod+k when not in terminal focus).

Updates global and in-chat shortcut handling to toggle the palette and to ignore other shortcuts while the palette is open, and factors shared thread creation + thread sorting into chatThreadActions.ts and lib/threadSort.ts (with updated tests) to support palette actions like opening settings, jumping to a project’s latest thread, or creating new threads.

Also adjusts overlay stacking (toasts/dialog backdrop z-index) and extends docs/contracts/server defaults/tests to include the new command.

^{Written by Cursor Bugbot for commit 0fffcb9. This will update automatically on new commits. Configure here.}

coderabbitai · 2026-03-15T04:13:37Z

Important

Review skipped

Auto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: 97ce1ac1-3e46-4a09-ab2e-1b14bcd19133

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

🔍 Trigger review

✨ Finishing Touches

🧪 Generate unit tests (beta)

Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

apps/server/src/keybindings.ts

nmggithub · 2026-03-15T05:25:20Z

apps/web/src/components/CommandPalette.tsx

+      data-testid="command-palette"
+    >
+      <Command aria-label="Command palette" items={groups}>
+        <CommandInput placeholder="Search commands and threads..." />


Is search still incoming? I don't see any code for that functionality and it doesn't appear to work on my end.

nmggithub · 2026-03-15T05:26:32Z

apps/web/src/components/CommandPalette.tsx

+            await navigate({
+              to: "/$threadId",
+              params: { threadId: thread.id },


Not an issue with your code, but something I noticed. If this is done to a thread that is hidden beneath "view more", that section doesn't expand, so it ends up looking like no sidebar item is highlighted.

Could you point me to how this was addressed? Still seems to be happening to me on the latest pull.

Noojuno · 2026-03-15T06:26:02Z

@binbandit Yours is obviously more of a strict command pallette than #1076, but it might be worth looking into.

I also think that some of the ordering of actions could be slightly different and be a slightly better workflow. I have been playing with my own command pallette in a branch, and I think for me the best structure wasn't a strict Actions/Threads split, but was more like this:

New
- Contains "New thread in ", "New thread in..." two stage action that allows you to choose a project, add project action (similar to feat: add project command dialog with filesystem path autocomplete #1076)
Recent threads
- List of threads in order
Actions
- Custom top bar actions for the current thread
- Git actions
Settings
- Just open settings page for now, but I think could list specific settings and take you straight to them in a future enhancement

I found that a lot of the "Actions" I initially had were actually pretty infrequently used, so I had to move down a lot to get to the stuff that I actually wanted. Especially stuff like "Settings", which should be very infrequently used, and can live at the very bottom of the list.

Not saying this is objectively better, but it's what I found worked for me after I originally had basically the order you have. Happy to push up my branch if you wanna see what I mean.

binbandit · 2026-03-15T06:28:56Z

@Noojuno This is good feedback. Thanks.

I was going to get this in, then allow for users to drag and drop in settings to re-organise the palette etc. Choose what they want to see etc. -- Was going to do this after so as to not bloat this pr.

Noojuno · 2026-03-15T06:27:55Z

apps/server/src/keybindings.ts

  { key: "mod+n", command: "terminal.new", when: "terminalFocus" },
  { key: "mod+w", command: "terminal.close", when: "terminalFocus" },
  { key: "mod+d", command: "diff.toggle", when: "!terminalFocus" },
+  { key: "mod+k", command: "commandPalette.toggle", when: "!terminalFocus" },


I think there's probably justification for triggering the command pallette even when the terminal is open. I doubt mod+k is gonna be a terminal keyboard shortcut, but I could see myself working in the terminal and wanting to navigate away and it being annoying to click out to focus the window

Yeah true, this wasn't something i've considered, as I have previously seen the two as two different states of interaction.

Working with the ai and the threads

Working with the terminal and running additional commands rather than asking ai to do it.

The main time I would run into it I think is if I'm working on two worktrees of the same thing (like T3 Code).

I will usually have my dev command running into the terminal on the worktree I was last testing, then I'll kill that command and want to navigate to the next worktree I need to check on and run the command there. Being able to Ctrl+K would be useful there (and also how I've been doing it in my command pallette branch)

Noojuno · 2026-03-15T06:29:53Z

apps/web/src/components/CommandPalette.tsx

+        title: "New thread",
+        description: activeProjectTitle
+          ? `Create a draft thread in ${activeProjectTitle}`
+          : "Create a new draft thread",


I don't think this description adds much beyond clutter tbh. I don't think I'm getting more info than just the title, and we could compact the UI a bit by removing the descriptions that aren't needed.

If the title was just "New draft thread in ${activeProjectTitle}" I think it would be more compact overall

The desc is useful for the thread list though, with the project being the desc

Noojuno · 2026-03-15T06:33:33Z

apps/web/src/components/CommandPalette.tsx

+                          executeItem(item);
+                        }}
+                      >
+                        <span className="flex size-8 shrink-0 items-center justify-center rounded-md border border-border/70 bg-muted/30">


I think some of the styling here could be compacted a bit to match the popup in the chat when you use /. Particularly this icon and the border around it, feels a bit weird for one place to have a box around the icon and another to not.

Noojuno · 2026-03-15T06:35:07Z

@Noojuno This is good feedback. Thanks.

I was going to get this in, then allow for users to drag and drop in settings to re-organise the palette etc. Choose what they want to see etc. -- Was going to do this after so as to not bloat this pr.

That's fair, although honestly I feel like that level of customisation is probs overkill tbh. It could be useful, but I don't think I can think of a command pallette in an app where I can reorder sections, or a time where I have ever really looked for that option haha.

huxcrux · 2026-03-15T06:43:03Z

I really like this however have 2 suggestions

I think when searching for threads there should be a timestamp on the right hand side,

I would also like to search for projects (including their path), this could use the same create thread as being used in the sidebar

nmggithub · 2026-03-15T06:58:20Z

apps/web/src/components/CommandPalette.tsx

+        const descriptionParts = [
+          projectTitle,
+          thread.branch ? `#${thread.branch}` : null,
+          thread.id === activeThread?.id ? "Current thread" : null,
+        ].filter(Boolean);


If my Tray PR is ever merged, I might "steal" this as our canonical "description" for a thread. Unless we expect this to change frequently as we iterate.

nmggithub · 2026-03-15T06:59:10Z

apps/web/src/components/CommandPalette.tsx

+                          {item.description ? (
+                            <span className="truncate text-muted-foreground/70 text-xs">
+                              {item.description}
+                            </span>


Do we want to truncate the description? Would it ever get too long?

nmggithub · 2026-03-15T07:24:39Z

apps/web/src/components/CommandPalette.tsx

+          value: `thread:${thread.id}`,
+          label: `${thread.title} ${projectTitle ?? ""} ${thread.branch ?? ""}`.trim(),
+          title: thread.title,
+          description: descriptionParts.join(" · "),


Using this character (or really any separator character) might not be super friendly to screen readers. Perhaps that could be fixed with ARIA.

binbandit · 2026-03-15T08:56:45Z

@huxcrux ooft quality suggestions. Thank you!

U wanna contribute them to own them?

Reach out on discord and ill give you write access so then your name appears next to the feature 😄
Username: ._0siris_.

eggfriedrice24 · 2026-03-15T09:32:50Z

Heyyy, nice work! We can close 1076 if you consider adding add project functionality with autocompletion here, I mean we can close it regardless 🤣 but I would really love that feature.

binbandit · 2026-03-15T10:07:23Z

Heyyy, nice work! We can close 1076 if you consider adding add project functionality with autocompletion here, I mean we can close it regardless 🤣 but I would really love that feature.

do you want to contribute that feature of it? So then your work / recognition doesn't get lost?
If so reach out on discord

eggfriedrice24 · 2026-03-15T10:16:05Z

Heyyy, nice work! We can close 1076 if you consider adding add project functionality with autocompletion here, I mean we can close it regardless 🤣 but I would really love that feature.

do you want to contribute that feature of it? So then your work / recognition doesn't get lost? If so reach out on discord

Would love to! The filesystem browse endpoint and autocomplete logic from #1076 should fit right in, commits in there are detailed so we could cherry pick the relevant pieces. I'll reach out on Discord.

edit: @binbandit invite sent.

Noojuno · 2026-03-15T11:08:41Z

apps/web/src/components/CommandPalette.tsx

+  readonly items: ReadonlyArray<CommandPaletteItem>;
+}
+
+const CommandPaletteContext = createContext<CommandPaletteState | null>(null);


Any thoughts on moving this out into zustand to match (most of) the rest of the app state?

…lette

…mand-palette # Conflicts: # apps/web/src/components/ChatView.browser.tsx # apps/web/src/components/Sidebar.tsx

apps/web/src/lib/threadSort.ts

…-core # Conflicts: # apps/web/src/components/Sidebar.logic.test.ts # apps/web/src/components/Sidebar.logic.ts

brrock · 2026-03-25T07:27:33Z

another banggggerrrr

…mand-palette # Conflicts: # apps/web/src/components/Sidebar.logic.ts # apps/web/src/components/Sidebar.tsx # apps/web/src/routes/_chat.tsx

…mand-palette

apps/web/src/lib/threadSort.ts

packages/shared/src/DrainableWorker.ts

apps/web/src/components/Sidebar.logic.ts

apps/web/src/relativeTime.ts

Resolve merge conflicts in Sidebar.logic.ts and _chat.tsx after merging origin/main. Accept main's new getLatestUserMessageTimestamp and getThreadSortTimestamp functions in Sidebar.logic.ts, use inline sort in sortThreadsForSidebar to match main's approach. Fix projects reference in _chat.tsx and CommandPalette.tsx after useHandleNewThread return type changed. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

…DrainableWorker drain race - Export toSortableTimestamp from threadSort.ts, remove duplicate in Sidebar.logic.ts - Rename formatRelativeTime in timestampFormat.ts to formatCompactRelativeTime to avoid name collision with relativeTime.ts - Fix DrainableWorker drain race where non-atomic Ref.get + Deferred.await could resolve prematurely when enqueue replaces the idle deferred between the two ops

packages/shared/src/DrainableWorker.ts

…ed by this PR)

apps/web/src/lib/threadSort.ts

Remove relativeTime.ts and merge its logic into timestampFormat.ts with a single shared bucketing implementation. formatRelativeTime now returns structured { value, suffix } and supports short/long styles. formatRelativeTimeLabel wraps it as a convenience string helper.

…Label everywhere Revert timestampFormat.ts to main's version (no long style, no bucketing abstraction). Use formatRelativeTimeLabel in command palette instead of the removed formatRelativeTime from relativeTime.ts. Delete relativeTime.ts.

cursor

Cursor Bugbot has reviewed your changes and found 2 potential issues.

^{Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.}

apps/web/src/components/CommandPalette.tsx

apps/web/src/lib/threadSort.ts

Widen threadSort.ts types to support optional messages and latestUserMessageAt. Remove duplicate sorting logic from Sidebar.logic.ts and replace sortThreadsForSidebar with sortThreads everywhere.

…groups

…ette labels

binbandit added 2 commits March 15, 2026 15:08

feat(web): add extensible command palette

7bef645

perf(web): avoid closed-state command palette work

17073d5

github-actions bot added size:XL 500-999 changed lines (additions + deletions). vouch:trusted PR author is trusted by repo permissions or the VOUCHED list. labels Mar 15, 2026

nmggithub reviewed Mar 15, 2026

View reviewed changes

apps/server/src/keybindings.ts Show resolved Hide resolved

nmggithub reviewed Mar 15, 2026

View reviewed changes

fix(web): align command palette search and shortcut

869181f

binbandit force-pushed the t3code/extensible-command-palette branch from 713d184 to 869181f Compare March 15, 2026 06:01

Noojuno reviewed Mar 15, 2026

View reviewed changes

nmggithub reviewed Mar 15, 2026

View reviewed changes

command palette add thread timestamps and projects (#1)

897b9ed

eggfriedrice24 mentioned this pull request Mar 15, 2026

feat: add project command dialog with filesystem path autocomplete #1076

Closed

7 tasks

Noojuno reviewed Mar 15, 2026

View reviewed changes

eggfriedrice24 added 5 commits March 15, 2026 11:16

feat(contracts): add filesystem.browse WS method and request schema

e7ffca4

feat(contracts): add browseFilesystem to NativeApi interface

cefe926

feat(server): add filesystem browse endpoint with directory listing

ea52bb3

feat(web): wire browseFilesystem to WS transport

c6a9033

feat(web): add project browser with filesystem browsing to command pa…

7bc39e6

…lette

Noojuno force-pushed the t3code/extensible-command-palette branch from bf38df8 to d836174 Compare March 25, 2026 05:44

Merge remote-tracking branch 'origin/main' into t3code/extensible-com…

4884b42

…mand-palette # Conflicts: # apps/web/src/components/ChatView.browser.tsx # apps/web/src/components/Sidebar.tsx

cursor bot reviewed Mar 25, 2026

View reviewed changes

apps/web/src/lib/threadSort.ts Show resolved Hide resolved

refactor(command-palette): split out filesystem browsing

65ab9e3

Noojuno mentioned this pull request Mar 25, 2026

feat: add filesystem browse API and path utilities Noojuno/t3code#2

Open

5 tasks

Merge remote-tracking branch 'origin/main' into split/command-palette…

4bcb1b5

…-core # Conflicts: # apps/web/src/components/Sidebar.logic.test.ts # apps/web/src/components/Sidebar.logic.ts

Noojuno added 3 commits March 26, 2026 21:17

Merge remote-tracking branch 'origin/main' into t3code/extensible-com…

57c5f7d

…mand-palette # Conflicts: # apps/web/src/components/Sidebar.logic.ts # apps/web/src/components/Sidebar.tsx # apps/web/src/routes/_chat.tsx

test(web): use merged settings fixture in browser test

10d436e

Merge remote-tracking branch 'origin/main' into t3code/extensible-com…

d86c11a

…mand-palette

cursor bot reviewed Mar 29, 2026

View reviewed changes

apps/web/src/lib/threadSort.ts Show resolved Hide resolved

Noojuno added 2 commits March 29, 2026 22:35

feat(web): open latest thread from project search

0cb4b2b

feat(web): support archived threads in command palette

87ee5aa

cursor bot reviewed Mar 29, 2026

View reviewed changes

packages/shared/src/DrainableWorker.ts Show resolved Hide resolved

apps/web/src/components/Sidebar.logic.ts Show resolved Hide resolved

fix(web): filter archived threads from command palette search

8e22d9b

cursor bot reviewed Mar 29, 2026

View reviewed changes

apps/web/src/relativeTime.ts Outdated Show resolved Hide resolved

Noojuno and others added 2 commits March 31, 2026 13:54

macroscopeapp bot reviewed Mar 31, 2026

View reviewed changes

packages/shared/src/DrainableWorker.ts Outdated Show resolved Hide resolved

revert DrainableWorker drain change (pre-existing issue, not introduc…

4909e9b

…ed by this PR)

cursor bot reviewed Mar 31, 2026

View reviewed changes

apps/web/src/lib/threadSort.ts Show resolved Hide resolved

Noojuno added 4 commits March 31, 2026 15:03

revert DrainableWorker to main's STM-based implementation

e636664

cleanup: remove unnecessary as const assertions

9d569bd

cursor bot reviewed Mar 31, 2026

View reviewed changes

apps/web/src/components/CommandPalette.tsx Outdated Show resolved Hide resolved

apps/web/src/lib/threadSort.ts Show resolved Hide resolved

refactor(web): consolidate thread sorting into threadSort.ts

0e09795

Widen threadSort.ts types to support optional messages and latestUserMessageAt. Remove duplicate sorting logic from Sidebar.logic.ts and replace sortThreadsForSidebar with sortThreads everywhere.

Noojuno force-pushed the t3code/extensible-command-palette branch from 0303987 to 0e09795 Compare March 31, 2026 02:49

Noojuno added 2 commits March 31, 2026 16:00

fix(web): derive isActionsOnly from deferredQuery to match displayed …

b889cb2

…groups

refactor(web): rename "local thread" to "fresh thread" in command pal…

0fffcb9

…ette labels

Conversation

binbandit commented Mar 15, 2026 • edited by macroscopeapp bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Validation

Visual

Add extensible command palette with mod+k shortcut to the sidebar and global shortcuts

Uh oh!

coderabbitai bot commented Mar 15, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Review skipped

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Noojuno commented Mar 15, 2026

Uh oh!

binbandit commented Mar 15, 2026

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Noojuno commented Mar 15, 2026

Uh oh!

huxcrux commented Mar 15, 2026

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

binbandit commented Mar 15, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

eggfriedrice24 commented Mar 15, 2026

Uh oh!

binbandit commented Mar 15, 2026

Uh oh!

eggfriedrice24 commented Mar 15, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

eggfriedrice24 Mar 15, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

brrock commented Mar 25, 2026

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

cursor bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

binbandit commented Mar 15, 2026 •

edited by macroscopeapp bot

Loading

coderabbitai bot commented Mar 15, 2026 •

edited

Loading

binbandit commented Mar 15, 2026 •

edited

Loading

eggfriedrice24 commented Mar 15, 2026 •

edited

Loading

eggfriedrice24 Mar 15, 2026 •

edited

Loading